<template>
	<view class="content">
		<swiper class="carousel" indicator-dots
			circular
			autoplay
			indicator-active-color="#3390F0"
			interval=3000
			@change="swiperChange()">
			<!-- <swiper-item v-for="(item,index) in swipers" :key="index">
								<image :src="item"></image>
							</swiper-item> -->
			<!-- <swiper-item><image src="../../static/resources/xw1.jpg" style="width: 100%;height: 100%;" mode="aspectFill">1</image></swiper-item> -->
			<swiper-item><image src="../../static/resources/xw1.webp" style="width: 100%;height: 100%;" mode="aspectFill">2</image></swiper-item>
			<!-- <swiper-item><image src="../../static/resources/xw3.jpg" style="width: 100%;height: 100%;" mode="aspectFill">3</image></swiper-item> -->
		</swiper>
		<view class="main_nav">
			<ul>
				<li>
					<view @click="toPage('/pages/dept/dept',false)">
						<image  src="../../static/index/consult.png"></image>
						<p>门诊挂号</p>
					</view>
				</li>
				<li>
					<view @click="toPage('/pages/chat/chat',false)">
						<image  src="../../static/index/54@2x.png"></image>
						<p>在线咨询</p>
					</view>
				</li>
				<li>
					<view  @click="toPage('/pages/guide/guide',false)"><!--toPage('/pages/guide/guide',false)-->
						<image  src="../../static/index/guide.png"></image>
						<p>智能导诊</p>
					</view>
				</li>
			</ul>
		</view>
		<view class="outpatient_service">
			<h3>门诊服务</h3>
			<ul>
				<li>
					<view @click="toPage('../appointmentRecord/appointmentRecord',true)">
						<image  src="../../static/index/reservation_record.png"></image>
						<p>挂号记录</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../clinic/clinicPay',true)">
						<image  src="../../static/index/outpatient_payment.png"></image>
						<p>门诊支付</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../clinic/clinicPayRecord',true)">
						<image  src="../../static/index/outpatient_payment_record.png"></image>
						<p>门诊缴费记录</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../medicalCard/medicalCardList',true)">
						<image  src="../../static/index/of_patient.png"></image>
						<p>就诊人</p>
					</view>
				</li>
				<!-- <li>
					<navigator>
						<image  src="../../static/index/reservation_record.png"></image>
						<p>订单列表</p>
					</navigator>
				</li>
				<li>
					<navigator>
						<image  src="../../static/index/outpatient_payment.png"></image>
						<p>门诊列表</p>
					</navigator>
				</li> -->
			</ul>
		</view>
		
		
		<view class="outpatient_service">
			<h3>住院服务</h3>
			<ul>
				<li>
					<view @click="toPage('../hospitalizedPay/hospitalizedType',true)">
						<image  src="../../static/index/hospital_recharge.png"></image>
						<p>住院充值</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../hospitalizedCostRecord/hospitalizedCostRecord',true)">
						<image  src="../../static/index/87@3x.png"></image>
						<p>住院费用记录</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../payRecord/payRecord',true)">
						<image  src="../../static/index/recharge_record.png"></image>
						<p>住院充值记录</p>	
					</view>
				</li>
				<!-- <li>
					<navigator>
						<image  src="../../static/index/prepay_record.png"></image>
						<p>预交充值记录</p>
					</navigator>
				</li> -->
			</ul>
		</view>
		
		<view class="outpatient_service">
			<h3>便民服务</h3>
			<ul>
				<li>
					<view @click="toPage('../report/reportQuery?type=2',true)">
						<image  src="../../static/index/90@3x.png"></image>
						<p>查看报告</p>
					</view>
				</li>
				<li>
					<view @click="mapNavigation()">
						<image src="../../static/index/91@3x.png"></image>
						<p>来内导航</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../hospitalInfo/hospitalInfo',false)">
						<image  src="../../static/index/92@3x.png"></image>
						<p>医院简介</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../drug/drug',false)">
						<image  src="../../static/index/93@3x.png"></image>
						<p>药品药剂</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../consult/consultList',true)">
						<image src="../../static/index/94@3x.png"></image>
						<p>咨询留言</p>
					</view>
				</li>
				<li>
					<view @click="toPage('../nucleicAcidTesting/nucleicAcidTesting',true)">
						<image  src="../../static/index/95@3x.png"></image>
						<p>核酸检测</p>
					</view>
				</li>
				<li>
					<view @click="close()">
						<image  src="../../static/index/96@3x.png"></image>
						<p>电子发票</p>
					</view>
				</li>
			</ul>
		</view>
	</view>
</template>

<script>
	var jweixin = require('jweixin-module');
	export default {
		data() {
			return {
				mainNav:[],
				outpatientData:[],
				hospitalizedData:[],
				convenienceData:[]
			}
		},
		onShow() {
			//this.$cardInput()
		},
		onLoad(option) {
			var params=this.getUrlParams();
			if(params.code){
				this.init(params.code);
			}else{
				var href=encodeURIComponent(location.href);
				location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxec6807f412198012&redirect_uri=' +href + '&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect';
			}
		},
		methods: {
			init(code){
				this.$post("/jsapi/userInfo",{"code":code,"scope":"base"},res=>{
					console.log(res);
					if(res.state==200){
						var openid=res.data.openid;
						uni.setStorageSync("openid",openid);
					}else{
						uni.showToast({
							title:res.message,
							icon:"none",
							duration:5000
						})
						return;
					}
				})
			},
			mapNavigation(){
				uni.showLoading({
					mask:true,
					title:"加载中..."
				})
				let uri=location.href;
				//如果其他
				this.$post("/jsapi/jssdk",{"uri":decodeURIComponent(uri)},res=>{
					if(res.state==200){
						jweixin.config({
						   debug: false, // 开	启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
						   appId: res.data.appid, // 必填，公众号的唯一标识
						   timestamp: res.data.timestamp, // 必填，生成签名的时间戳
						   nonceStr: res.data.noncestr, // 必填，生成签名的随机串
						   signature: res.data.signature,// 必填，签名
						   jsApiList: ["openLocation","getLocation"] // 必填，需要使用的JS接口列表
						})
						jweixin.ready(()=>{
							jweixin.getLocation({
								type:"gcj02",
								success:function(res) {
									jweixin.openLocation({
										latitude:26.83612522,
										longitude:106.602325,
										name:"修文县人民医院",
										address:"贵州省贵阳市修文县翠屏东路延伸段",
										scale:18
									});
								}
							})
						})
						
					}else{
						uni.showToast({
							title:res.message
						})
					}
					uni.hideLoading();
				})
				
			},
			getUrlParams(){
			    var url = location.search; //获取url携带的参数
			    var urlParams = new Object();
			    if (url.indexOf("?") != -1) {
			        var str = url.substr(1);
			        var strs = str.split("&");
			        for(var i = 0; i < strs.length; i ++) {
			            urlParams[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
			        }
			    }
			    return urlParams;
			},
			toPage(url,loginFlag){
				if(loginFlag){
					this.$cardInput({"url":url});
				}else{
					uni.navigateTo({
						url:url
					})
				}
			},
			swiperChange(e){
				
			},
			close(){
				uni.showToast({
					title:"此功能暂未开放",
					icon:"none"
				})
			}
		}
	}
</script>

<style>
	.carousel{
		width: 100%;
		height:144px;
		background-color:rgba(78, 160, 255,0.43);
		border-radius: 10px;
	}
	.main_nav{
		width: 100%;
		background: #FFFFFF;
		height: 120px;
		border-radius:10px;
		margin-top: 10px;
	}
	.main_nav ul {
		float: left;
		padding: 0px;
		width: 100%;
		height: 100%;
		list-style: none;
	}
	.main_nav ul li{
		float: left;
		width: 33.2%;
		margin-top: 20px;
		text-align: center;
	}
	.main_nav ul li image{
		width:48px;
		height: 48px;
	}
	.main_nav ul li p{
		margin-top:10px;
	}
	
	.outpatient_service{
		width: 100%;
		background: #FFFFFF;
		display:inline-block;
		border-radius:10px;
		margin-top: 10px;
		padding-bottom: 20px;
	}
	.outpatient_service h3{
		margin-left: 16px;
		line-height: 36px;
	}
	.outpatient_service ul {
		float: left;
		padding: 0px;
		width: 100%;
		height: 100%;
		list-style: none;
		color:#333333;
		font-size: 14px;
		font-family: 'Source Han Sans CN';
	}
	.outpatient_service ul li{
		float: left;
		width: 25%;
		margin-top: 18px;
		text-align: center;
	}
	.outpatient_service ul li image{
		width:48px;
		height: 48px;
	}
	.outpatient_service ul li p{
		margin-top:12px;
	}
</style>
